<nav class="navbar-default navbar-static-side" role="navigation" id="menu-nav">
    <div class="sidebar-collapse">
        <ul class="nav metismenu" id="side-menu">
            <li class="nav-header" v-on:click="_gotoIndex()">
                <div class="dropdown profile-element">
                    <a data-toggle="dropdown" class="dropdown-toggle" href="/">
                        <span class="block m-t-xs font-bold">{{vc.i18n('systemName')}}</span>
                    </a>
                </div>
                <div class="logo-element">
                    {{vc.i18n('systemSimpleName')}}
                </div>
            </li>

            <li v-for="menu in menus" v-bind:class="{ active: menu.active }" :key="menu.id">
                <a v-if="menu.childs != undefined && menu.childs.length >0" href="javascript:void(0)" v-on:click="switchMenu(menu.id)">
                    <i class="fa " v-bind:class="menu.icon"></i>
                    <span class="nav-label">{{vc.i18n(menu.name)}}</span>
                    <span v-if="menu.label != undefined && menu.label != ''" class="float-right label label-primary">{{menu.label}}</span>
                    <span v-if="menu.label == undefined || menu.label == ''" class="float-right fa fa-angle-right"></span>
                </a>
                <ul v-if="menu.childs != undefined && menu.childs.length >0" class="nav nav-second-level collapse" v-bind:class="{in: menu.active}">
                    <li v-for="subMenu in menu.childs" v-if="subMenu.isShow == 'Y'" v-bind:class="{ active: subMenu.active }">
                        <a v-on:click="_gotoPage(subMenu.href,subMenu.name)" href="javascript:void(0)">{{vc.i18n(subMenu.name)}}</a>
                    </li>
                </ul>
                <a v-if="menu.childs == undefined || menu.childs.length ==0" href="javascript:void(0)" v-on:click="_gotoPage(menu.href,subMenu.name)">
                    <i class="fa " v-bind:class="menu.icon"></i>
                    <span class="nav-label">{{vc.i18n(menu.name)}}</span>
                </a>
            </li>
        </ul>

    </div>
</nav>